<!DOCTYPE html>
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
		<link rel="stylesheet" href="/css/main.css"/>
		<script>
			init = function() {
				document.getElementById('headline').innerText = chrome.i18n.getMessage('headline');

				document.getElementById('section_1').innerText = chrome.i18n.getMessage('section_1');
				document.getElementById('section_2').innerText = chrome.i18n.getMessage('section_2');
				
				for (var i = 1; i <= 5; i++) {
					document.getElementById('link_'+String(i)).innerText = chrome.i18n.getMessage('link_'+String(i)+'_text');
					document.getElementById('link_'+String(i)).href = "javascript:openLink('"+chrome.i18n.getMessage("link_"+String(i)+"_url")+"')";
				}

				delete init;
			}

			openLink = function(url) {
				switch (window.localStorage.getItem('link_target')) {
					case null:
					case undefined:
					case 'new_tab':
						chrome.tabs.create({'url': url});
						break;
					case 'active_tab':
						chrome.windows.getCurrent(function(w) {
							wid = w.id;
							chrome.tabs.getSelected(wid, function(t) {
								tid = t.id;
								chrome.tabs.update(tid, {'url': url});
							});
						});
						break;
					case 'new_window':
						chrome.windows.create({'url': url});
						break;
				}

				window.close();
			}
		</script>
	</head>
	<body onload="init()">
		<h1 id="headline"></h1>
		<h2 id="section_1"></h2>
		<ul>
			<li><a id="link_1" href=""></a></li>
			<li><a id="link_2" href=""></a></li>
			<li><a id="link_3" href=""></a></li>
			<li><a id="link_4" href=""></a></li>
		</ul>
		<h2 id="section_2"></h2>
		<ul>
			<li><a id="link_5" href=""></a></li>
		</ul>
	</body>
</html>